﻿@{
Layout = null;
}

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title></title>
		<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
		<link href="~/layui/css/layui.css" rel="stylesheet">
		<script src="~/lib/jquery/dist/jquery.min.js"></script>
		<script src="~/js/site.js" asp-append-version="true"></script>
		<script src="~/layui/layui.js"></script>
		<script src="~/js/echarts.min.js"></script>
	</head>
	<body>

		<div class="layui-padding-4">
			<form class="layui-form">
				<div class="demo-login-container">

					<div class="layui-form-item">
						<div class="layui-input-wrap">
							<div class="layui-input-prefix">
								<i class="layui-icon layui-icon-fonts-i"></i>
							</div>
							<input type="int" name="id" id="id" value="" placeholder="用户Id" autocomplete="off"
								class="layui-input" lay-affix="clear" disabled>
						</div>
					</div>

					<div class="layui-form-item">
						<div class="layui-input-wrap">
							<div class="layui-input-prefix">
								<i class="layui-icon layui-icon-username"></i>
							</div>
							<input type="text" name="name" id="name" value="" lay-verify="required" placeholder="用户名"
								lay-reqtext="请填写用户名" autocomplete="off" class="layui-input" lay-affix="clear">
						</div>
					</div>

					<div class="layui-form-item">
						<div class="layui-input-wrap">
							<div class="layui-input-prefix">
								<i class="layui-icon layui-icon-cellphone-fine"></i>
							</div>
							<input type="text" name="phoneNumber" id="phoneNumber" value="" lay-verify="required"
								placeholder="联系电话" lay-reqtext="请填写联系电话" autocomplete="off" class="layui-input"
								lay-affix="clear">
						</div>
					</div>

					<div class="layui-form-item">
						<div class="layui-input-wrap">
							<div class="layui-input-prefix">
								<i class="layui-icon layui-icon-fonts-code"></i>
							</div>
							<input type="text" name="password" id="password" value="" lay-verify="required"
								placeholder="登陆密码" lay-reqtext="请填写登陆密码" autocomplete="off" class="layui-input"
								lay-affix="clear">
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">权限设置</label>
						<div class="layui-input-block">
							<input type="checkbox" id="q1" name="q1" lay-skin="tag" title="首页权限">
							<input type="checkbox" id="q2" name="q2" lay-skin="tag" title="采购权限">
							<input type="checkbox" id="q3" name="q3" lay-skin="tag" title="销售权限">
							<input type="checkbox" id="q4" name="q4" lay-skin="tag" title="收支权限">
						</div>
					</div>

					<div class="layui-form-item">
						<button class="layui-btn layui-btn-fluid" lay-submit lay-filter="add-user" id="btn-addUser">提交</button>
					</div>

				</div>
			</form>
		</div>

		<script>
			layui.use(function() {
				var layer = layui.layer;
				var form = layui.form;

				//获取当前路由中的name
				const urlParams = new URLSearchParams(window.location.search);
				const getUrlName = urlParams.get('name');
				//如果name存在，则获取name的信息渲染到页面
				if (getUrlName != null) {
					$.get('/api/Users/GetUserOne', {
							name: getUrlName
						},
						function(response) {
							if (response.code == 200) {
								data = response.data;
								document.getElementById('id').value = data.id;
								document.getElementById('name').value = data.name;
								document.getElementById('phoneNumber').value = data.phoneNumber;
								document.getElementById('password').value = data.password;
								document.getElementById('q1').checked = data.q1 == 1 ? true : false;
								document.getElementById('q2').checked = data.q2 == 1 ? true : false;
								document.getElementById('q3').checked = data.q3 == 1 ? true : false;
								document.getElementById('q4').checked = data.q4 == 1 ? true : false;

								//渲染表单
								form.render();
								
							}
						});
				}
				
				// 提交事件
				form.on('submit(add-user)', function(data) {
					var field = data.field; // 获取表单字段值
					field.q1 = field.q1 == 'on' ? 1 : 0;
					field.q2 = field.q2 == 'on' ? 1 : 0;
					field.q3 = field.q3 == 'on' ? 1 : 0;
					field.q4 = field.q4 == 'on' ? 1 : 0;
					if (getUrlName == null) {
						console.log(1);
						field.id = 0;
						$.ajax('/api/Users/Add', {
							method: 'POST',
							headers: {
								'Content-Type': 'application/json'
							},
							data: JSON.stringify(field),
							success: function(result) {
								if (result.code == 200) {
									layer.msg(result.message);
									setTimeout(function() {
										location.reload();
									}, 1500);
								} else {
									layer.msg(result.message);
								}
							},
							error: function(err) {
								console.log(err);
								console.log(JSON.stringify(field));
							}
						});
					}else{
						console.log(2);
						$.ajax('/api/Users/Edit', {
							method: 'POST',
							headers: {
								'Content-Type': 'application/json'
							},
							data: JSON.stringify(field),
							success: function(result) {
								if (result.code == 200) {
									layer.msg(result.message);
									setTimeout(function() {
										location.reload();
									}, 1500);
								} else {
									layer.msg(result.message);
								}
							},
							error: function(err) {
								console.log(err);
								console.log(JSON.stringify(field));
							}
						});
					}

					
					return false;
				});
			});
		</script>
	</body>
</html>